<template>
  <div class="news-wrap">
    <Header></Header>
    <div class="tabs-list">
      <div
        v-for="(item, index) in tabsList"
        :key="index"
        :class="{ 'tabs-item': true, 'tabs-item-active': index === currentIndex }"
        @click="handleTabClick(index)">
        <img :src="index === currentIndex ? item.activeSrc : item.src" alt="">
        <span>{{ item.name }}</span>
      </div>
    </div>
    <div class="news-list">
      <div class="news-item" v-for="(item, index) in newsList" :key="index" @click="handleNewsClick(item)">
        <div class="item-pic">
          <img :src="item.pic" alt="">
        </div>
        <div class="item-info">
          <h5>{{ item.title }}</h5>
          <p>{{ item.desc }}</p>
          <span>{{ item.create_time_text }}</span>
        </div>
      </div>
      <a-pagination v-model="current" :total="total" show-less-items />
    </div>
    <Empty v-if="newsList.length === 0" emptyText="暂无数据"></Empty>
    <Footer></Footer>
    <Services></Services>
  </div>
</template>

<script src="./index"></script>
<style lang="less" scoped>
@import "./index.less";
</style>
